﻿@import "../../LiberUI/Style/Default/Theme";
@import "../../LiberUI/Style/Default/_soIcons";

@font-face {
  font-family: 'SoIcons';
  src: url('/LiberUI/Style/Default/fonts/iconfont.eot');
  src: url('/LiberUI/Style/Default/fonts/iconfont.eot') format('embedded-opentype'), url('/LiberUI/Style/Default/fonts/iconfont.woff') format('woff'), url('/LiberUI/Style/Default/fonts/iconfont.ttf') format('truetype'), url('/LiberUI/Style/Default/fonts/iconfont.svg') format('svg');
  font-weight: normal;
  font-style: normal;
}

$headHeight:80px;
#headBar {
    position: relative;
    margin: 0 auto;
    height: $headHeight;
    background-color:$ClrTheme;
    color:white;
    z-index: 99;
    -moz-transition: all ease 0.3s;
    -o-transition: all ease 0.3s;
    -webkit-transition: all ease 0.3s;
    transition: all ease 0.3s;
}

#siteLogo{
    height:$headHeight;
    background-image: url('/SiteUI/Imgs/logo-white.png');
    background-size:auto $headHeight;
    background-position:left center;
    background-repeat:no-repeat;
}

#siteLink{
    text-align:center;
    &>a{
        display:inline-block;
        height:$headHeight;
        line-height:$headHeight;
        border-bottom:none;
        color:white;
        margin-left:2em;
        &:hover{
            color:$ClrFocus;
        }
    }
}

#viewOpenUser{
    margin-top:1rem;
    padding:1rem 0;
    height:auto;
    border:1px solid lighten($ClrThemeTxt,10);
    background-color:white;
    text-align:center;
    display:none;
}
#viewBindAcnt{
    margin-top:3rem;
    padding:1rem 0;
    height:auto;
    border:1px solid lighten($ClrThemeTxt,10);
    background-color:white;
    text-align:center;
    & input{
        width:100%;
    }
}
#vr-login{
    text-align:left;
}

#userInfo_headImg{
    margin:10px auto;
    height:100px;
    border:1px solid black;
}
#userInfoTxt{
    display:inline-block;
    text-align:center;
    margin-top:1rem;

}
#userInfo_prompt{
    margin-top:1rem;
}
#userInfo_name{
    @include Title($ClrThemeTxt);
}
#userInfo_tip{
    @include Title($ClrThemeTxt);
    margin-top:1rem;
}

#viewRegister{
    margin-top:1rem;
    min-height:70%;
    border:1px solid lighten($ClrThemeTxt,10);
    background-color:white;
    padding-bottom:2rem;
    margin-bottom:1rem;
    & input{
        width:100%;
    }
}

#vr-steps1{
    height:6rem;
    background-image: url('/SiteUI/Imgs/register-steps1.png');
    background-size:100% 80%;
    background-repeat:no-repeat;
    border-bottom:1px solid $ClrThemeTxt;
    background-position-y:center;
}
#vr-steps2{
    height:6rem;
    background-image: url('/SiteUI/Imgs/register-steps2.png');
    background-size:100% 80%;
    background-repeat:no-repeat;
    border-bottom:1px solid $ClrThemeTxt;
    background-position-y:center;
}
#vr-steps3{
    height:6rem;
    background-image: url('/SiteUI/Imgs/register-steps3.png');
    background-size:100% 80%;
    background-repeat:no-repeat;
    border-bottom:1px solid $ClrThemeTxt;
    background-position-y:center;
}


#vr-tip{
    margin-top:4rem;
    margin-bottom:2rem;
    height:3rem;
    line-height:3rem;
    background-color:$ClrInfo;
    text-align:center;
    border-top:1px solid lighten($ClrThemeTxt,10);
    border-bottom:1px solid lighten($ClrThemeTxt,10);
}

#vr-mphone{
    padding:0;
}

#vr-captcha{
    padding:0;
}

#vr-acnt{
    display:none;
    & input{
        width:100%;
    }
}

#vr-company{
    & input{
        width:100%;
    }
}

#vr-success{
    text-align:center;
    &>div{
        display:inline-block;
        &>div{
            display:inline-block;
            text-align:left;
            height:5rem;
            padding-left:1rem;
        }
        &>img{
            height:5rem;
        }
    }
}

#txbMPhone,#txbCaptcha,#txbPassword,#txbConfirmPwd{
    width:100%;
    margin-bottom:2rem;
}


#btnSendCaptcha,#btnSendCaptcha_old,#btnSendCaptcha_new{
    padding:0 0 0 1rem;
    &>.button{
        width:100%;
        font-weight:normal;
    }
}

.inputTip{
    height:40px;
    line-height:40px;
    margin-bottom:2rem;
    padding-left:1rem;
    color:$ClrErr;
    &.success{
        color:$ClrTheme;
    }
    &.info{

    }
}

#it-idcard{
    margin-bottom:0;
}
#picIDCard-face{
    &>img{
        width:100%;
        max-height:10rem;
    }
}

.picUpload{
    text-align:left;
    height:8rem;
    background-color:lightgray;
    &>img{
        width:100%;
        height:100%;
    }
}

.picExample{
    text-align:right;
    height:8rem;
    &>img{
        width:95%;
        height:95%;
        opacity:0.7;
    }
}

#btnApply{
    margin-top:1rem;
    margin-bottom:1rem;
}

.companyView{
    padding:0.5rem 0;
    border-bottom:1px dashed gray;
    &:hover{
        background-color:lighten($ClrTheme,40);
        & .btnApply{
            @include btnStyle();
        }
    }
}
.companyView:nth-child(2n+1){
    background-color:lighten($ClrThemeBk,80);
    &:hover{
        background-color:lighten($ClrTheme,40);
        & .btnApply{
            @include btnStyle();
        }
    }
}

#pnlCreateCompany{
    margin-top:1rem;
    padding:1rem 0;
    text-align:center;
    font-size:1.2rem;
    border-top:1px solid $ClrThemeTxt;
}

#face_reminder{
  padding-left:2rem;
}

#face_subbtn{
    background:$ClrMsg;
    border:1px solid $ClrMsgBorder;
    padding-left:2rem;
    padding-top:1rem;
}

#joinApplyEnd{
    height:100%;
    width:100%;
    background-color:rgba(0,0,0,0.6);
}
#RealNameTitle{
    text-align:center;
    margin-top:4rem;
    font-size:2rem;
}
#certificationTime{
    background:#E2E0E0;
    margin-bottom:2rem;
    box-shadow: 5px 5px 5px #888888;
    text-align:center;
    }
.tl_ions{
    background-image: url('../Imgs/certify-logo.gif');
    background-size:3rem;
    background-position:0.2rem 0.2rem;
    background-repeat:no-repeat;
    background-position-x:right;
}

#mailUs > a > i {
    display: inline-block;
    font: normal normal normal 14px/1 SoIcons;
    font-size: 1.4rem;
    line-height: 0.66667rem;
    vertical-align: -15%;
    text-rendering: auto;
    -webkit-font-smoothing: antialiased;
}

 #txb-feedback{
    margin-bottom:1rem;
    border-radius:10px;
    border:1px solid rgba(218, 92, 92, 0.84);
        padding-left:3.5em;
  
}
 #txb-feedback:before{
            content:"";
            background-image: url('../Imgs/prompt_icons.png');
            background-repeat:no-repeat;
            background-size:3rem auto;
            height:3rem;
            width:3rem;
            background-position:0 -5.7rem;
            display:block;
            position:absolute;
            margin-left:-3.5rem;
 }

 
#pageFoot{
    padding-top:1rem;
    color:$ClrThemeTxt;
    z-index:1;
    background-color:$ClrThemeBk;
    &>div{
        line-height:2rem;
    }
}
#aboutUs{
    line-height:3rem;
    padding-top:2rem;
}
#connactUs{
    &>h3{
        color:white;
    }
}
#mailUs{
    &>h3{
        color:white;
    }
    &>a{
        &>i{
            @include soicon($ClrThemeTxt);
        }
        &:hover{
            &>i{
                @include soicon($ClrTheme);
            }
        }
    }
}
#wxUs{
    &>h3{
        color:white;
    }
    &>img{
        width:80%;
    }
}
